@include('Admin.public.head')
<body>
@include('Admin.public.menu')
<!-- 引入样式 -->
<div class=" admin-content" id="app">
    <div class="daohang">

    </div>
<!--充值模态框-->
    <div class="admin-biaogelist">
        <div class="listbiaoti am-cf">
            <ul class="am-icon-yen"> 提现</ul>
            <dl class="am-icon-home" style="float: right;">当前位置： 首页 > <a href="#">提现</a></dl>
            <!--这里打开的是新页面-->
        </div>

        <div class="am-btn-toolbars am-btn-toolbar am-kg am-cf">
            <ul>
                <li>
                    <template>
                        <el-select v-model="keyword.status" placeholder="提现状态">
                            <el-option
                                    size="medium"
                                    v-for="val,index in options"
                                    :key="index"
                                    :label="val.label"
                                    :value="val.value">
                            </el-option>
                        </el-select>
                    </template>
                </li>

                <li>
                    <div class="block">
                        <el-date-picker
                                v-model="keyword.withdraw_time"
                                type="datetimerange"
                                value-format="yyyy-MM-dd HH:mm:ss"
                                range-separator="~"
                                start-placeholder="开始日期"
                                end-placeholder="结束日期">
                        </el-date-picker>
                    </div>
                </li>

                {{--<li>--}}
                    {{--<template>--}}
                        {{--<el-select v-model="keyword.status" placeholder="订单状态">--}}
                            {{--<el-option--}}
                                    {{--size="medium"--}}
                                    {{--v-for="item in options"--}}
                                    {{--:key="item.value"--}}
                                    {{--:label="item.label"--}}
                                    {{--:value="item.value">--}}
                            {{--</el-option>--}}
                        {{--</el-select>--}}
                    {{--</template>--}}
                {{--</li>--}}
                <li>
                    <el-input v-model="keyword.keyword" class="keywords" placeholder="关键词搜索"></el-input>
                </li>
                <li>
                    <el-button type="primary" v-on:click="changeClick()">搜索</el-button>
                </li>
                <li> <el-button type="success" v-on:click="exportDetail()">导出</el-button></li>
                <li> <el-button type="danger" v-on:click="resetOrder()">重置</el-button></li>
            </ul>
        </div>

        <form class="am-form am-g">
            <table width="100%" class="am-table am-table-bordered am-table-radius am-table-striped">
                <thead>
                <tr class="am-success">
					<th class="table-title">所选类型</th>
                    <th class="table-type">用户账号</th>
                    <th class="table-type">用户姓名</th>
					<th class="table-title">收款账号</th>
                    <th class="table-title">收款类型</th>
					<th class="table-title">开户姓名</th>
                    <th class="table-title">开户行地址</th>
                    <th class="table-author am-hide-sm-only">提现金额</th>
                    <th class="table-author am-hide-sm-only">实际金额</th>
                    <th class="table-author am-hide-sm-only">手续费</th>
                    <th class="table-author am-hide-sm-only">申请日期</th>
                    <th class="table-date am-hide-sm-only">审核日期</th>
                    <th class="table-date am-hide-sm-only">审核人</th>
                    <th class="table-date am-hide-sm-only">备注</th>
                    <th class="table-date am-hide-sm-only">状态</th>
                    @can('withdrawal-operation')
                    <th width="130px" class="table-set">操作</th>
                    @endcan
                </tr>
                </thead>
                <tbody>
                <tr v-for="val,index in withdraw">
					<!-- <td>@{{val.withdrawal_type}}</td> -->
					<td>
						<span v-show="val.withdrawal_type == 1">电子积分</span>
						<!-- <span v-show="val.withdrawal_type == 3">分享积分</span> -->
						<span v-show="val.withdrawal_type == 2">奖励积分</span>
					</td>
                    <td>@{{ val.name }}</td>
                    <td>@{{ val.user_name }}</td>
					<td><a href="#"><strong>@{{ val.collection_number  }}</strong></a></td>
                    <td>@{{ val.beneficiary_name  }}</td>
					<td>@{{ val.account_name  }}</td>
                     <td>@{{ val.ip }}</td>
                    <td >@{{ val.money }}</td>
                    <td ><code>@{{ val.actual_money }}</code></td>
                    <td >@{{ val.procedure }}</td>
                    <td >@{{ val.withdraw_time }}</td>
                    <td >@{{ val.audit_time }}</td>
                    <td>@{{ val.operator }}</td>
                    <td>@{{ val.remarks }}</td>
                    <td>
                        <div class="am-btn-toolbar">
                            <div class="am-btn-group am-btn-group-xs" v-show="val.status == -1">
                                <code>已驳回</code>
                            </div>
                            <div class="am-btn-group am-btn-group-xs" v-show="val.status == 0">
                                <code>申请</code>
                            </div>
                            <div class="am-btn-group am-btn-group-xs" v-show="val.status == 1">
                                已处理
                            </div>
                        </div>
                    </td>
                    @can('withdrawal-operation')
                    <td >
                        <div class="am-btn-toolbar">
                            {{--<div class="am-btn-group am-btn-group-xs" v-show="val.status == -1">--}}
                                {{--<code>已驳回</code>--}}
                            {{--</div>--}}
                            <div class="am-btn-group am-btn-group-xs" v-show="val.status == 0">
                                <a class="am-btn am-btn-danger am-radius" v-on:click="reject(val.id,index,val.withdrawal_type)" title="驳回">驳回</a>
                                <a class="am-btn am-btn-secondary am-radius" v-on:click="manage(val.id,index,val.withdrawal_type)" title="确定">确定</a>
                            </div>
                            {{--<div class="am-btn-group am-btn-group-xs" v-show="val.status == 1">--}}
                               {{--已处理--}}
                            {{--</div>--}}
                        </div>
                    </td>
                    @endcan
                </tr>
                </tbody>
            </table>
            <!--分页-->
            <ul class="am-pagination am-fr">
                <div class="block">
                    <el-pagination
                            background
                            :page-size="PagesData.per_page"
                            :current-page = "PagesData.current_page"
                            layout="total , prev, pager, next"
                            :total="PagesData.total"
                            @prev-click="changeClick"
                            @next-click="changeClick"
                            @current-change="changeClick">
                    >
                    </el-pagination>
                </div>
            </ul>
			<div>
				提现总额:<span class="am-badge am-badge-danger am-radius">@{{ total }}&nbsp;&nbsp;&nbsp;&nbsp;</span>
			</div>
        </form>

        <script type="text/javascript">

        </script>
        <script>
            var app = new Vue({
                el:"#app",
                data: {
					total:'',
                    options: [{
                        value: '-1',
                        label: '已驳回'
                    },{
                        value: '0',
                        label: '待处理'
                    },{
                        value: '1',
                        label: '提现成功'
                    }],

                    pickerOptions2: {
                        shortcuts: [{
                            text: '最近一周',
                            onClick(picker) {
                                const end = new Date();
                                const start = new Date();
                                start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
                                picker.$emit('pick', [start, end]);
                            }
                        }, {
                            text: '最近一个月',
                            onClick(picker) {
                                const end = new Date();
                                const start = new Date();
                                start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
                                picker.$emit('pick', [start, end]);
                            }
                        }, {
                            text: '最近三个月',
                            onClick(picker) {
                                const end = new Date();
                                const start = new Date();
                                start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
                                picker.$emit('pick', [start, end]);
                            }
                        }]
                    },
                    withdraw : [],
                    PagesData:[],
                    pase:'',
                    keyword:{ //关键字搜索
                        status:'',
                        withdraw_time:'',
                        keyword:'',
                    },
                },
                //事件
                methods: {
                    //选择当前页
                    changeClick:function(e){
                        var rico = this
                        $.get("/admin/finance/withdraw",{'_token':'{{csrf_token()}}',class:'select',page:e,keyword:app.keyword},function (res) {
                            if(res.code){
                                app.withdraw = res.data.data
                                for(var i=0;app.withdraw.length>i;i++){
                                    app.withdraw[i].withdraw_time = rico.formatDateTime(app.withdraw[i].withdraw_time)
                                    if(app.withdraw[i].audit_time != null){
                                        app.withdraw[i].audit_time = rico.formatDateTime(app.withdraw[i].audit_time)
                                    }
                                }
                                app.PagesData = res.data
								app.total = res.total
                            } else {
                                layer.msg(res.data);
                            }
                        });
                    },

                    initialize:function () {
                        var rico = this
                        //用户列表
                        $.get("/admin/finance/withdraw",{'_token':'{{csrf_token()}}',class:'select'},function (res) {
                            if(res.code){
                                app.withdraw = res.data.data
                                for(var i=0;app.withdraw.length>i;i++){
                                    app.withdraw[i].withdraw_time = rico.formatDateTime(app.withdraw[i].withdraw_time)
                                    if(app.withdraw[i].audit_time != null){
                                        app.withdraw[i].audit_time = rico.formatDateTime(app.withdraw[i].audit_time)
                                    }
                                }
                                app.pase = res.data.current_page;
                                app.PagesData = res.data
								app.total = res.total
                                // console.dir(res.data)
                            } else {
                                layer.msg(res.data);
                            }
                        });
                    },
                    formatDateTime:function (timeStamp) {
                        var date = new Date();
                        date.setTime(timeStamp * 1000);
                        var y = date.getFullYear();
                        var m = date.getMonth() + 1;
                        m = m < 10 ? ('0' + m) : m;
                        var d = date.getDate();
                        d = d < 10 ? ('0' + d) : d;
                        var h = date.getHours();
                        h = h < 10 ? ('0' + h) : h;
                        var minute = date.getMinutes();
                        var second = date.getSeconds();
                        minute = minute < 10 ? ('0' + minute) : minute;
                        second = second < 10 ? ('0' + second) : second;
                        return y + '-' + m + '-' + d+' '+h+':'+minute+':'+second;
                    },
                    //驳回
                    reject:function (id,i,type) {
                        //prompt层
                        layer.prompt({title: '驳回说明:', formType: 2}, function(text, index){
                            layer.close(index);
                            $.post("/admin/finance/withdraw",{'_token':'{{csrf_token()}}',class:'revamp',id:id,withdrawal_type:type,withdraw:{remarks:text,status:-1}},function (res) {
                                if(res.code){
                                    layer.msg(res.data,{time:600},function () {
                                        location.reload();
                                    },500);
                                } else {
                                    layer.msg(res.data);
                                }
                            });
                        })

                    },
                    manage:function (id,i,type) {
                        //prompt层//询问框
                        layer.confirm('确定已经打款？', {
                            btn: ['确定','取消'] //按钮
                        }, function(){
                            $.post("/admin/finance/withdraw",{'_token':'{{csrf_token()}}',class:'revamp',id:id,withdrawal_type:type,withdraw:{status:1}},function (res) {
                                if(res.code){
                                    layer.msg(res.data,{time:600},function () {
                                        location.reload();
                                    },500);
                                } else {
                                    layer.msg(res.data);
                                }
                            });
                        });
                    },
                    //重置
                    resetOrder:function(){
                        location.reload();
                    },
                    //导出
                    exportDetail:function(){
                        location.href="/admin/finance/exportDetail?status="+app.keyword.status+'&withdraw_time='+app.keyword.withdraw_time+'&keyword='+app.keyword.keyword+'&ClickType=3';
                    }

                },

            //自动执行
                mounted: function () {
                    this.initialize();
                },
            })
        </script>


@include('Admin.public.foot')